@charset "utf-8";

@import "common";


.web{
    header{
        height: n(105px);
    }
    color:#000000;
    section{
        /***搜索部分***/
        .s_search{
            text-align: center;
            /***搜索框***/
            .search{
                margin: 0 auto;
                width: n(270px);
                height: n(55px);
                border:n(2px) $border-color solid ;
                border-radius: n(25px);
                margin-top: n(37px);
                line-height: n(54px);
                font-size: 0;
                input{
                    height: n(50px);
                    line-height: n(50px);
                    margin-left: n(18px);
                    padding-left:n(4px);
                    font-size: n(24px);
                    border: none;
                    background: none;
                    width: n(195px);
                    vertical-align: middle;
                    &::-webkit-input-placeholder{
                        font-size: $font-24;
                        font-family: microsoft yahei;
                    }
                }
                i{
                    vertical-align: middle;
                    color: $border-color;
                }
            }
            /**大家都在搜**/
            p{
                font-size: $font-26;
                margin-top: n(30px);
                margin-bottom: n(14px);
            }
            .p_search{
                width: n(512px);
                margin: 0 auto;
                font-size: 0;
                line-height: n(64px);
                a{
                    display: inline-block;
                    width:n(125px);
                    height: n(64px);
                    background: $abgcolor;
                    font-size: $font-20;
                    margin-left: n(4px);
                    color: #898989;
                    vertical-align: middle;
                    &:first-child,&:nth-child(5){
                        margin-left: 0;
                    }
                    &:nth-child(5),&:nth-child(6),&:nth-child(7),&:nth-child(8){
                        margin-top: n(4px);
                    }
                }
            }
        }
        /**热门搜索**/
        .s_remen{
            margin-top: n(18px);
            .left{
                width: 37.34%;
                height: 46.9%;
                @include imgoverflow;
                margin-left: n(20px);
                margin-right: n(10px);
                line-height: 46.9%;
            }
            .right{
                overflow: hidden;
                height: 46.89%;
                .top{
                    width: 95.5%;
                    @include imgoverflow;
                    margin-bottom: n(8px);
                }
                .bottom{
                    .b_left{
                        width: 44%;
                        @include imgoverflow;
                    }
                    .b_right{
                        width: 48%;
                        @include imgoverflow;
                        margin-right: n(20px);
                    }
                }
            }
        }
        /***推荐搜索***/
        .s_tuijian{
//          margin: 0 n(20px);
            font-size: 0;
            .tuijian{
                width:calc(100%/3);
                height:calc(100%/3.42);
                display: inline-block;
                div{
                    width: 91.2%;
                    height: 80%;
                    @include imgoverflow;
                    padding-left: n(20px) ;
                    img{
                        width: 100%;
                        height: 100%;
                        vertical-align: middle;
                    }
                }
            }
        }//last of div.tuijian
        
    }
}
